.image-wrapper {
  position: relative;
  width: 100%; /* Set the width of the image wrapper to match your image */
}
.image-wrapper2 {
  position: relative;
  width: 100%; /* Set the width of the image wrapper to match your image */
}

.image-wrapper img {
  float: left;
  shape-outside: url(#image-shape); /* Reference the ID of the SVG shape */
  clip-path: url(#image-shape); /* Clip the image using the SVG shape */
  width: 450px; /* Set the width of the image */
  margin-right: 20px; /* Adjust the margin as needed */
}
.image-wrapper2 img {
  margin-right: 0;
  float: right;
  width: 450px; /* Set the width of the image */
  margin-left: 20px; /* Adjust the margin as needed */
  max-width: 90vw;
}

.image-wrapper p {
  margin-top: 0;
}

@media screen and (max-width: 767px) {
  .image-wrapper {
    position: unset;
    width: 100%; /* Set the width of the image wrapper to match your image */
  }
  .image-wrapper2 {
    position: unset;
    width: 100%; /* Set the width of the image wrapper to match your image */
  }
  .image-wrapper img {
    text-align: center;
    float: none;
    shape-outside: url(#image-shape); /* Reference the ID of the SVG shape */
    clip-path: url(#image-shape); /* Clip the image using the SVG shape */
    width: 100%; /* Set the width of the image */
    margin-right: 20px; /* Adjust the margin as needed */
  }
  .image-wrapper2 img {
    margin-right: 0;
    float: right;
    width: 100%; /* Set the width of the image */
    margin-left: 20px; /* Adjust the margin as needed */
    max-width: 90vw;
  }
}